import 'package:flutter/material.dart';

class FancyFab extends StatefulWidget {
  final Function(int index) onPressed;

  const FancyFab({
    Key? key,
    required this.onPressed,
  }) : super(key: key);

  @override
  _FancyFabState createState() => _FancyFabState();
}

class _FancyFabState extends State<FancyFab>
    with SingleTickerProviderStateMixin {
  bool isOpened = false;
  late AnimationController _animationController;
  late Animation<Color?> _animateColor;
  late Animation<double> _animateIcon;
  late Animation<double> _translateButton;
  Curve _curve = Curves.easeOut;
  double _fabHeight = 56.0;

  @override
  void initState() {
    _animationController =
        AnimationController(vsync: this, duration: Duration(milliseconds: 500))
          ..addListener(() {
            setState(() {});
          });
    _animateIcon =
        Tween<double>(begin: 0.0, end: 1.0).animate(_animationController);
    _animateColor = ColorTween(
      begin: Colors.blue,
      end: Colors.red,
    ).animate(CurvedAnimation(
        parent: _animationController,
        curve: Interval(0.00, 1.00, curve: _curve)));
    _translateButton = Tween<double>(
      begin: _fabHeight,
      end: -14.0,
    ).animate(CurvedAnimation(
      parent: _animationController,
      curve: Interval(
        0.0,
        0.75,
        curve: _curve,
      ),
    ));
    super.initState();
  }

  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }

  animate() {
    if (!isOpened) {
      _animationController.forward();
    } else {
      _animationController.reverse();
    }
    isOpened = !isOpened;
  }

  Widget article() {
    return new Container(
      child: FloatingActionButton(
        onPressed: (){
          animate();
          widget.onPressed(0);
        },
        tooltip: '收藏站外文章',
        heroTag: 'article',
        child: Icon(Icons.article),
      ),
    );
  }

  Widget language() {
    return new Container(
      child: FloatingActionButton(
        onPressed: (){
          animate();
          widget.onPressed(1);
        },
        tooltip: '收藏网址',
        heroTag: 'language',
        child: Icon(Icons.language),
      ),
    );
  }

  Widget todo() {
    return new Container(
      child: FloatingActionButton(
        onPressed: (){
          animate();
          widget.onPressed(2);
        },
        tooltip: '添加TODO',
        heroTag: 'todo',
        child: Icon(Icons.format_list_numbered),
      ),
    );
  }

  Widget share() {
    return new Container(
      child: FloatingActionButton(
        onPressed: (){
          animate();
          widget.onPressed(3);
        },
        tooltip: '广场分享文章',
        heroTag: 'share',
        child: Icon(Icons.share),
      ),
    );
  }



  Widget toggle() {
    return FloatingActionButton(
      backgroundColor: _animateColor.value,
      onPressed: animate,
      tooltip: 'Toggle',
      heroTag: 'Toggle',
      child: AnimatedIcon(
        icon: AnimatedIcons.menu_close,
        progress: _animateIcon,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.end,
      children: <Widget>[
        Transform(
            transform: Matrix4.translationValues(
              0.0,
              _translateButton.value * 4.0,
              0.0,
            ),
            child: article()),
        Transform(
            transform: Matrix4.translationValues(
              0.0,
              _translateButton.value * 3.0,
              0.0,
            ),
            child: language()),
        Transform(
            transform: Matrix4.translationValues(
              0.0,
              _translateButton.value * 2.0,
              0.0,
            ),
            child: todo()),
        Transform(
            transform: Matrix4.translationValues(
              0.0,
              _translateButton.value,
              0.0,
            ),
            child: share()),
        toggle(),
      ],
    );
  }
}
